<template>
  <view class="body">
    <view
      class="loading_bg"
      :style="{
        backgroundImage: `url(${oss2('others/cloud/loading_bg.png')})`,
      }"
    >
      <view
        class="loading_Progress"
        :style="{
          backgroundImage: `url(${oss2('others/cloud/loading.png')})`,
        }"
      >
        <view
          class="loading_Progress_icon"
          :style="{
            backgroundImage: `url(${oss2('others/cloud/yui.png')})`,
            left: `${iconLeft}px`,
          }"
        ></view>
      </view>

      <view
        class="loading_title"
        :style="{
          backgroundImage: `url(${oss2('others/cloud/jiazai.png')})`,
        }"
      >
      </view>
    </view>
  </view>
</template>

<script setup>
import { oss2 } from "@/utils/utils";
import { onShow } from "@dcloudio/uni-app";

onShow(async () => {
  getApp().accessLogAdd();

  switch (true) {
    default:
      if (uni.getLaunchOptionsSync().query.from) {
        setTimeout(() => {
          uni.redirectTo({
            url:
              "/" +
              uni.getLaunchOptionsSync().path +
              "?from=" +
              uni.getLaunchOptionsSync().query.from,
          });
        }, 2500);
      } else {
        setTimeout(() => {
          uni.redirectTo({
            url: "/" + uni.getLaunchOptionsSync().path,
          });
        }, 2500);
      }

      break;
  }
});
</script>

<style>
page {
  background-color: #1335b4 !important;
}
</style>
<style lang="less" scoped>
.body {
  width: 100%;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;

  .loading_bg {
    width: 100%;
    height: 812px;
    background-repeat: no-repeat;
    background-position: top left;
    background-size: 375px 100%;
    position: relative;
    image {
      width: 100%;
      height: 100%;
    }
  }

  .loading_Progress {
    position: absolute;
    width: 241px;
    height: 11px;
    bottom: 94px;
    left: 67px;
    background-repeat: no-repeat;
    background-position: top left;
    background-size: 241px 100%;
    .loading_Progress_icon {
      position: absolute;
      width: 26px;
      height: 21px;
      top: -3px;
      background-repeat: no-repeat;
      background-position: top left;
      background-size: 26px 100%;
      animation: ellipsis 2s;
    }
  }

  .loading_title {
    position: absolute;
    width: 65px;
    height: 17px;
    bottom: 53px;
    left: 157px;
    background-repeat: no-repeat;
    background-position: top left;
    background-size: 65px 100%;
  }
}

@keyframes ellipsis {
  from {
    left: 0;
  }
  to {
    left: 230px;
  }
}
</style>

